<template>
  <div class="jobCard" @click="toDetail(resumeItem.id)">
    <van-row type="flex" justify="space-between" class="job_salary">
      <van-col span="6" class="resume" >
        <van-image width="80" height="100" fit="fill" :src="employee" />
      </van-col>
      <van-col span="18" class="salary_mode">
        <van-row type="flex" justify="left" class="job_salary">
          <van-col span="24" class="resume">学历：{{resumeItem.recruiting_position}}</van-col>
        </van-row>

        <van-row type="flex" justify="left" class="job_salary">
          <van-col span="24" class="resume">技术：{{resumeItem.recruiting_position}}</van-col>
        </van-row>
        <van-row type="flex" justify="left" class="job_salary">
          <van-col span="24" class="resume">专业：{{resumeItem.recruiting_position}}</van-col>
        </van-row>
        <van-row type="flex" justify="left " class="job_salary">
          <van-col span="24" class="resume">技能：{{resumeItem.recruiting_position}}</van-col>
        </van-row>
      </van-col>
    </van-row>



    <van-row type="flex" justify="space-between" class="time_status">
      <van-col span="18" class="time">
        {{keyWord === 'home' ? '发布时间' : '报名时间'}}：
        <span>{{resumeItem.create_time}}</span>
      </van-col>
      <van-col span="6" class="status">
      </van-col>
    </van-row>


  </div>
</template>

<script>
  import { Dialog } from 'vant';
  import jobCategoryObj from '../constants/jobCategoryObj';
  import { payMoneyModeObj} from '../constants/payMoneyMode';
  import {feeUnitObj} from '../constants/comUtils';
  import employee from '@/assets/img/employee.jpg';

  export default {
    name: 'comResumeList',
    data(){
      return {
        feeUnitObj,
        payMoneyModeObj,
        jobCategoryObj,
        employee: employee,
      }
    },
    props: ['resumeItem', 'keyWord', 'path', 'routeName'],
    methods: {
      toDetail(id){
        if (this.routeName != 'resumeDetail'){
          this.$router.push({
            path: `/resumeDetail/${id}`,
          })
        }
      },
      goToNeedPage(keyWord){
        const id = this.resumeItem.id
        if (keyWord === 'lendMoney'){
          // todo 联调时修改
          if (this.resumeItem.isLendMoney === 1){
            if (this.path === '/lendMoneyRecords' || this.path === '/searchRecords/lendMoney' || this.path === '/queryRecords/lendMoney'){
              this.$router.push({
                path: `/lendMoneyDetail/${id}`,
              })
            } else {
              if(this.resumeItem.work_end_time){
                Dialog.alert({
                  message: '您已离职，无法借支。如有疑问，请联系客服。',
                  theme: 'round-button',
                }).then(() => {
                  // on close
                });
              } else {
                this.$router.push({
                  path:'/applyLendMoney',
                  query:{
                    "id": id
                  }
                })
              }
            }
          } else {
            if(this.resumeItem.work_end_time){
              Dialog.alert({
                message: '您已离职，无法借支，如有疑问请联系客服。',
                theme: 'round-button',
                messageAlign: 'left',
              }).then(() => {
                // on close
              });
            } else {
              this.$router.push({
                path:'/applyLendMoney',
                query:{
                  "id": id
                }
              })
            }

          }
        } else {
          this.$router.push({
            path: `/wageDetail/${id}`,
          })
        }

      },

      toLendDetailPage(){
        const id = this.resumeItem.id
        this.$router.push({
          path: `/lendMoneyDetail/${id}`,
        })
      },

      toRatePage(){
        const id = this.resumeItem.id
        this.$router.push({
          path: `/rate/${id}`,
        })
      },
    },

    computed: {
      isShowStartEndTime(){
        return this.keyWord === 'hasWorkedList' || this.keyWord === 'lendMoney' || this.keyWord === 'wageSettlement'
      },
      computedWorkColor(){
        switch (this.resumeItem.status) {
          case 0:
            return '#1989FA'
          case 1:
            return '#36D7B7'
          case 2:
            return '#07C160'
          case 3:
            return '#FF976A'
          default:
            return '#EE0A24'
        }
      },
      computedWorkStatus(){
        switch (this.resumeItem.status) {
          case 0:
            return '招工中'
          case 1:
            return '已报名'
          case 2:
            return '工作中'
          case 3:
            return '已离职'
          default:
            return '数据异常！'
        }
      },

      computedBtnText(){
        // 申请过
        if (this.resumeItem.isLendMoney ===1){
          if (this.path === '/lendMoneyRecords' || this.path === '/searchRecords/lendMoney' || this.path === '/queryRecords/lendMoney'){
            return '查看详情'
          } else {
            return '继续申请'
          }
        } else {
          return '点我申请'
        }
      },
      computedBtnType(){
        if (this.resumeItem.isLendMoney ===1){
          if (this.path === '/lendMoneyRecords' || this.path === '/searchRecords/lendMoney' || this.path === '/queryRecords/lendMoney'){
            return 'warning'
          } else {
            return 'danger'
          }
        } else {
          return 'danger'
        }
      },
    },

  }
</script>

<style lang="scss" scoped>
  .jobCard{
    background-color: #ffffff;
    border-top: .6px solid #E6E6E6;
    margin: 0;
    padding: 9px 13px;
    font-size: 13px;
    color: #848484;
    .job_salary{
      font-size: 14px;
      .resume{
        font-size: 16px;
        font-weight: bold;
        color: #030303;
        text-align: left;
      }
      .salary_mode{
        color: #676464;
        font-weight: bolder;
        text-align: right;
        font-size: 13.5px;
      }
    }
    .jobType_rating{
      font-size: 14px;
      margin: 6px 0;
      .jobType{
        color: #030303;
        & > span:first-of-type{
          margin-right: 8px;
        }
      }
      .salary{
        text-align: right;
        span{
          color: #FC525D;
        }
      }
      .rating{
        text-align: right;
      }
    }
    .address_agencyFee{
      .address{
        & > span:nth-child(2){
          margin: 0 6px;
        }
      }
      .agencyFee{
        text-align: right;
      }
    }
    .time_status{
      margin-top: 5px;
      .status{
        text-align: right;
      }
    }
  }
</style>
